// 1、热门推荐模块
$.ajax({
  type: "get",
  url: "/posts/recommend",
  success: (res) => {
    // console.log(res);
    var recommendTpl = `
    {{each data}}
        <li>
            <a href="detail.html?id={{$value._id}}">
                <img src="{{$value.thumbnail}}" alt="">
                 <p>{{$value.title}}</p>
            </a>
         </li>
    {{/each}}
        `;
    var html = template.render(recommendTpl, { data: res });
    // console.log(html);
    $(".hot-recommend").find("ul").html(html);
  },
});

// 2、最新发布的文章列表
$.ajax({
  type: "get",
  url: "/posts/lasted",
  success: (res) => {
    var html = "";
    $.each(res, (index, val) => {
      html += `
        <a href="detail.html?id=${val._id}">
            <div class="row">
                <div class="col-sm-9">
                    <h3>${val.title}</h3>
                    <p class="text-muted">${val.author.nickName}  发布于${
        val.createAt.split('T')[0]
      }</p>
                    <p class="hidden-xs">
                     ${val.content.substr(0, 100)}...
                    </p>
                    <p class="text-muted">阅读(${val.meta.views}) 评论({${
        val.meta.comments
      }) 点赞(${val.meta.likes}}) 标签：${val.category.title}</p>
                </div>
    
                <div class="col-sm-3 artic-img hidden-xs">
                    <img src="${val.thumbnail}" alt="">
                </div>
            </div>
        </a>
            `;
    });
    $("#publish").html(html);
  },
});

// 3、随机推荐的文章列表
$.ajax({
  type: "get",
  url: "/posts/random",
  success: (res) => {
    console.log(res);
    var html = "";
    $.each(res, (index, value) => {
      html += `
        <li>
        <a href="detail.html?id=${value._id}">
            <div class="row">
                <div class="col-sm-8 recomm-artic">
                    <h4>${value.title}</h4>
                    <p class="text-muted">阅读(${value.meta.views}) 喜欢(${value.meta.likes})</p>
                </div>
                <div class="col-sm-4 recomm-img">
                    <img src="${value.thumbnail}" alt="">
                </div>
            </div>
        </a>
    </li>
        `;
    });
    $("#randoomRec").html(html);
  },
});
